﻿#parse("partials/headerpopup.html")
<script type="text/javascript">
    $(document).ready(function () {
        ///Search Area

        var oTableEmp = $('#datalistemployee').dataTable({
            "bSort": false,
            "sPaginationType": "full_numbers",
            "bProcessing": false,
            "bServerSide": true,
            "bFilter": false,
            "sAjaxSource": "tablelistemployee",
            "aoColumns": [
                            { "mDataProp": "Id" },
                            { "mDataProp": "EmployeeNumber" },
                            { "mDataProp": "fullname" }
                        ],
            "aoColumnDefs": [
                                {
                                    "fnRender": function (o) {
                                        return "<center><a class='SelectedValue' title='Select Employee' href='javascript:void(0)' idx='" + o.aData['Id'] + "' namex='" + o.aData['fullname'] + "'><img src='/images/Icons/table.png'/></a> </center>";
                                    },
                                    "aTargets": [0]
                                }
                        ],
            "fnServerData": function (sSource, aoData, fnCallback) {
                aoData.push({ "name": "employeenumber", "value": $('#employeenumber').val() });
                aoData.push({ "name": "name", "value": $('#name').val() });
                jQuery.ajax({
                    "dataType": 'json',
                    "type": "GET",
                    "url": "tablelistemployee",
                    "data": aoData,
                    "success": fnCallback
                });
            }
        });

        function checkForEnter(event) {
            if (event.keyCode == 13) {
                oTableEmp.fnDraw();
            }
        }
        $('#employeenumber').keypress(checkForEnter);
        $('#name').keypress(checkForEnter);
        $('#DialogBtnSearchArea').click(function () { oTableEmp.fnDraw(); });

        //Add event click on list Area
        var Employee =
        $(".SelectedValue").live('click', function (event) {
            var id = $(this).attr("idx");
            var name = $(this).attr("namex");
            parent.SetEmployee(id, name);
        });
    });
</script>
<style>
    div#datalistemployee_filter
    {
        display: none;
    }
    div#datalistemployee_length
    {
        display: none;
    }
    .mws-table thead
    {
        margin-top: -10px;
    }
</style>
<div class="mws-form" action="#">
    <div class="mws-form-inline">     
            
                    <div class="mws-form-row">
                            <label>Employee Number</label>
                            <div class="mws-form-item large">
                                <div class="mws-form-cols clearfix">
                                    <div class="mws-form-col-2-8 alpha">
                                        <div class="mws-form-item">
                                            <input id="employeenumber" type="text" value="" class="mws-textinput" />
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    <div class="mws-form-row">
                            <label>Employee Name</label>
                            <div class="mws-form-item large">
                                <div class="mws-form-cols clearfix">
                                    <div class="mws-form-col-3-8 alpha">
                                        <div class="mws-form-item">
                                           <input id="name" type="text" value="" class="mws-textinput" />
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
    </div>
    
    <div class="mws-button-row">
        <input id="DialogBtnSearchArea" class="mws-button red" type="submit" value="Search" />
    </div>
    <div class="mws-form-row" style="padding-top: 10px">
        <table cellpadding="0" cellspacing="0" border="0" class="fullwidth mws-table" id="datalistemployee"
            width="60%">
            <thead>
                <tr>
                    <th style="width: 10px; text-align: center">
                        Actions
                    </th>
                    <th style="text-align: center">
                        Employee Number
                    </th>
                    <th style="text-align: center">
                        Employee Name
                    </th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td colspan="3" class="dataTables_empty">
                        <!-- <img src="${rooturl}Images/Custom/252.gif" />-->
                    </td>
                </tr>
            </tbody>
        </table>
    </div>
</div>
#parse("partials/footerpopup.html")